<!DOCTYPE html>
<html>
<head>
	<title>盒子模型应用</title>
	<meta charset="utf-8"/>
	<style type="text/css">
		#A{
			width:700px;
			height:250px;
			margin: 10px;
			border: 2px dotted red; 
		}
		#a{
			background: #ccc;
			width:400px;
			height:200px;
			margin: 10px;
			float: left;
		}
		#a div{
			width: 150px;
			height: 70px;
			/*margin: 5px;*/
			margin-left: 20px;
			margin-bottom: 20px;
			background:  #800080 ;
			float: left;
		}
		#b{
			width:200px;
			height:200px;
			margin:10px;
			background: #ccc;
			float:left;
		}
		#b div{
			width: 150px;
			height:40px;
			margin:5px;
			background: #800080 ;
			float: right;
		}
	</style>
</head>
<body>
	<div id="A">
		<div id="a">			
			<div>内容1</div>
			<div>内容1</div>
			<div>内容1</div>
			<div>内容1</div>
		</div>
		<div id="b">
			<div>内容1</div>
			<div>内容1</div>
			<div>内容1</div>
		</div>
	</div>
</body>
</html>